<!--
 * @Author: zhangxiangsheng 1026583651@qq.com
 * @Date: 2024-06-25 16:02:11
 * @LastEditors: zhangxiangsheng 1026583651@qq.com
 * @LastEditTime: 2024-06-25 17:17:14
 * @FilePath: \appGly\pages\Cards\Cards.vue
 * @Description: 
 * 
 * Copyright (c) 2024 by ${git_name_email}, All Rights Reserved. 
-->
<template>
	<view class="cardcontent">
		<getdatascrollview :api="getdata" cmax="20">
			<template #default="{ list }">
				<!-- ref="getdatascrollview" :api="getdata" -->
				<u-navbar title="实体卡管理"></u-navbar>
				<view v-for="(item, key) in list" :key="key" class="list-card" @click="itemtap(item)">
					<view class="header">
						<view class="iconfont iconhuiyuanchaxun_xiaofeiqia"></view>
						{{ item.printid }}
					</view>
					<view class="content">
						<view class="item">
							<view class="iconfont iconZHicon-"></view>
							{{ item.je / 100 }}{{$z.$t("元")}}
						</view>
						<view class="item">
							<view class="iconfont iconquyu"></view>
							{{ Station[item.pcs] }}
						</view>
						<view class="item">
							<view class="iconfont iconicon-gerenzhongxin"></view>
							{{ item.b_jh == "1" ? $z.$t("已激活") : $z.$t("未激活") }}
						</view>
					</view>
				</view>
			</template>
		</getdatascrollview>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				Station: [],
			};
		},
		created() {
			this.init();
		},
		methods: {
			async init() {
				let Station = await this.$z.request("/Station");
				Station = Station.reduce((acc, e) => {
					return {
						...acc,
						[e.id]: e.pcs,
					};
				}, {});
				this.Station = Station;
				console.log(Station);
			},
			async getdata(searchdata) {
				let Cards = await this.$z.request("/Cards", {
					type: 2,
					...searchdata,
				});
				let reqCardsJH = {};
				reqCardsJH.cardsum = Cards.length;
				Cards.forEach((element, i) => {
					reqCardsJH[`printid${i + 1}`] = element.printid;
				});
				let CardsJH = await this.$z.request("/CardsJH", reqCardsJH);
				let CardsJHselect = {};
				CardsJH.forEach((e) => {
					CardsJHselect[e.printid] = e.b_jh;
				});
				Cards.forEach((element, i) => {
					element.b_jh = CardsJHselect[element.printid];
				});
				// console.log(searchdata, "searchdata");
				return Cards;
			},
			itemtap(item) {
				// GetRfCard
				if (item.b_jh == "1") {
					this.$z.gopage(
						`/pages/Cards/Cardedt/Cardedt?printid=${item.printid}`
					);
				} else {
					this.$z.gopage(
						`/pages/Cards/Cardsedt/Cardsedt?printid=${item.printid}`
					);
				}
			},
		},
	};
</script>
<style>
	page {
		background: #efeff4;
	}
</style>
<style lang="scss">
	.cardcontent {
		height: 100vh;
		display: flex;
		flex-direction: column;
	}

	.list-card {
		margin: 20rpx;
		background: #fff;
		border-radius: 16rpx;
		overflow: hidden;

		.header {
			background: #2093f5;
			height: 88rpx;
			display: flex;
			align-items: center;
			color: #fff;

			.iconfont {
				height: 88rpx;
				width: 88rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				font-size: 48rpx;
			}
		}

		.content {
			display: flex;
			flex-wrap: wrap;

			.item {
				width: 50%;
				height: 88rpx;
				display: flex;
				align-items: center;

				.iconfont {
					height: 88rpx;
					width: 88rpx;
					display: flex;
					align-items: center;
					justify-content: center;
					font-size: 48rpx;
					color: #2093f5;
				}
			}
		}
	}
</style>